<template>
    <div class="container flex">

        <leftMenu />
        <!-- <div class="right_main"> -->
        <keep-alive>
            <Transition name="slide-up" mode="out-in">
                <router-view></router-view>
            </Transition>
        </keep-alive>
        <!-- </div> -->
    </div>
</template>
<script>
import { httpService } from "@/utils/httpService";
import { ElMessage } from "element-plus";
import leftMenu from "../../components/medicalProduct/leftMenu.vue";

export default {
    name: "MedicalProductIndex",
    components: { ElMessage, leftMenu },
    data() {
        return {

        };
    },
    computed: {},
    mounted() {
    },
    methods: {

    },
};
</script>
<style scoped>
* {
    padding: 0;
    margin: 0;
}

.flex {
    display: flex;
    align-items: center;
}

.container {
    width: 100vw;
    height: 100vh;
}

/* .bounce-enter-active {
    animation: bounce-in 0.5s;
}

.bounce-leave-active {
    animation: bounce-in 0.5s reverse;
}

@keyframes bounce-in {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
} */


.slide-up-enter-active,
.slide-up-leave-active {
  transition: all 0.25s ease-out;
}

.slide-up-enter-from {
  opacity: 0;
  transform: translateY(30px);
}

.slide-up-leave-to {
  opacity: 0;
  transform: translateY(-30px);
}
</style>